'use client'

import { Separator } from "@/components/ui/separator"
import NewsItem from "./_components/news-item"
import Slideshow from "./_components/slideshow"

const newsList = [
    {
        title: 'AIGC时代，需要什么样的云存储？',
        description: '在大模型加速发展的阶段，大模型企业也越来越重视云存储这一重要的底层基础设施能力。但AIGC时代，究竟需要什么样的云存储技术？',
        date: new Date(2024, 4, 10, 19, 55),
        source: '腾讯网',
        thumbnail: '/images/O2ozN-8owqbjLe1pbmb9rOS7C4e9f4rnBlNp4_5zDaP7wAA.jpg'
    },
    {
        title: 'AIGC能赚钱吗？',
        description: '从ChatGPT到Sora，AIGC不仅在技术上取得了重大突破，更引领了商业模式和产业生态的变革。\nAIGC的商业价值正在逐步显现。从几家上市公司的最新财报，或拟上市公司的招股书中，可窥其一斑。',
        date: new Date(2024, 4, 10, 18, 5),
        source: '腾讯网',
        thumbnail: '/images/OyBJfYk4GarcpP46t76n-oVWQUKLQbsTu0JpGeyVDgRB4AA.jpg'
    },
    {
        title: '当下的AIGC为我的工作带来了多少赋能？',
        description: 'AIGC助职场人弥补短板，文本创作省时，创意构思展现空间，但品牌运营需审慎应用。AIGC为我的工作带来了多少赋能？本文进行分享。',
        date: new Date(2024, 4, 10, 10, 8),
        source: '腾讯网',
        thumbnail: '/images/O5121x8YsXamkOaLbe9BETrPFdDgjXn4y8M2Ylj1xwMA4AA.jpg'
    },
    {
        title: `AIGC正在改变我们的世界丨钛媒体直击博鳌2024`,
        description: '2023年，在以ChatGPT为代表的生成式AI的涌现下，AI又一次站在了科技的历史舞台中央，AIGC这个词持续升温，一直火到了现在。而这种火爆的现象大概率将继续延续下去。',
        date: new Date(2024, 4, 7, 17, 37),
        source: '腾讯网',
        thumbnail: '/images/ObFIzCAPpP3hiSRYZxUxvcPBINuBZIq6EY0MgaaFHp8EUAA.jpg'
    },
    {
        title: `从“数字人”到AI导演：AIGC真正成为新质生产力了吗`,
        description: '当下，AIGC（生成式人工智能）技术在网络视听行业中的应用成为热议的话题。但AIGC真正成为新质生产力了吗？',
        date: new Date(2024, 4, 6, 11, 16),
        source: '腾讯网',
        thumbnail: '/images/OIPZA_I64q4-w1IGSrxLQxluFGEoYFQRqqWZTaP09GrXkAA.jpg'
    },
    {
        title: 'AIGC时代，需要什么样的云存储？',
        description: '在大模型加速发展的阶段，大模型企业也越来越重视云存储这一重要的底层基础设施能力。但AIGC时代，究竟需要什么样的云存储技术？',
        date: new Date(2024, 4, 10, 19, 55),
        source: '腾讯网',
        thumbnail: '/images/O2ozN-8owqbjLe1pbmb9rOS7C4e9f4rnBlNp4_5zDaP7wAA.jpg'
    },
    {
        title: 'AIGC能赚钱吗？',
        description: '从ChatGPT到Sora，AIGC不仅在技术上取得了重大突破，更引领了商业模式和产业生态的变革。\nAIGC的商业价值正在逐步显现。从几家上市公司的最新财报，或拟上市公司的招股书中，可窥其一斑。',
        date: new Date(2024, 4, 10, 18, 5),
        source: '腾讯网',
        thumbnail: '/images/OyBJfYk4GarcpP46t76n-oVWQUKLQbsTu0JpGeyVDgRB4AA.jpg'
    },
    {
        title: '当下的AIGC为我的工作带来了多少赋能？',
        description: 'AIGC助职场人弥补短板，文本创作省时，创意构思展现空间，但品牌运营需审慎应用。AIGC为我的工作带来了多少赋能？本文进行分享。',
        date: new Date(2024, 4, 10, 10, 8),
        source: '腾讯网',
        thumbnail: '/images/O5121x8YsXamkOaLbe9BETrPFdDgjXn4y8M2Ylj1xwMA4AA.jpg'
    },
    {
        title: `AIGC正在改变我们的世界丨钛媒体直击博鳌2024`,
        description: '2023年，在以ChatGPT为代表的生成式AI的涌现下，AI又一次站在了科技的历史舞台中央，AIGC这个词持续升温，一直火到了现在。而这种火爆的现象大概率将继续延续下去。',
        date: new Date(2024, 4, 7, 17, 37),
        source: '腾讯网',
        thumbnail: '/images/ObFIzCAPpP3hiSRYZxUxvcPBINuBZIq6EY0MgaaFHp8EUAA.jpg'
    },
    {
        title: `从“数字人”到AI导演：AIGC真正成为新质生产力了吗`,
        description: '当下，AIGC（生成式人工智能）技术在网络视听行业中的应用成为热议的话题。但AIGC真正成为新质生产力了吗？',
        date: new Date(2024, 4, 6, 11, 16),
        source: '腾讯网',
        thumbnail: '/images/OIPZA_I64q4-w1IGSrxLQxluFGEoYFQRqqWZTaP09GrXkAA.jpg'
    },
]

const topNewsList = [
    { title: `AIGC平台覆盖200万学生，教育数字化产品规模落地初见成效` },
    { title: `AIGC平台入校，各区素质教育数字化“升级”` },
    { title: `以作业系统撬动教学改革，平台助力学校教学增实效` },
    { title: `智慧校园未来全景首次呈现` },
    { title: `“双十亿计划”发布：10亿投入AI研发，10亿搭建生态体系` },
    { title: `首个《中国教育科技全球竞争力报告》发布` },
    { title: `个性化作业落地多个学校 助力教育提质增效` }
]

const EventsPage = () => {
    return (
        <div className="h-full pb-4 flex md:space-x-2">
            <div className="w-full md:w-3/4 flex flex-col">
                <Slideshow className="mb-4" />
                <div className="flex flex-col items-start px-2 md:px-0 md:pl-4 space-y-2">
                    {newsList.map((news, index) => (
                        <NewsItem
                            key={index}
                            title={news.title}
                            description={news.description}
                            date={news.date}
                            source={news.source}
                            thumbnail={news.thumbnail}
                        />
                    ))}
                </div>
            </div>
            <div className="hidden md:flex md:w-1/4">
                <div className="w-full flex flex-col px-2">
                    <h2 className="px-2 pt-8 font-semibold text-2xl"> Top News </h2>
                    <div className="relative h-16 flex items-center">
                        <Separator />
                        <div className="absolute left-4 w-16 h-2 bg-blue-600" />
                    </div>
                    <ul className="flex flex-col space-y-4">
                        {topNewsList.map((news, index) => (
                            <li key={index} className="flex items-center space-x-2">
                                <a href='#' className="text-sm font-extralight line-clamp-1 text-foreground hover:text-primary">{`● ${news.title}`}</a>
                            </li>
                        ))}
                    </ul>
                </div>
            </div>
        </div>
    )
}

export default EventsPage